<template>
	<view>
		<!-- <u-card :show-head="false" :showFoot="false" margin="30rpx">
			<view class="" slot="body" v-for="(o ,index) in courseNoticeData" :key="index">
				<view @click="gototext(o.id,o.courseId)" id="notices" class="u-body-item u-flex u-border-bottom u-col-between u-p-t-0">
					<u-row gutter="12">
						<u-col @click="gototext(o.id,o.courseId)" class="title" :span="8" style="font-size: 38rpx; font-weight: bold;">
							<text>{{o.courseNoticeTitle}}</text>
						</u-col>
						<u-col @click="gototext(o.id,o.courseId)" class="time" style="font-weight: lighter; font-size: 10rpx;">
							{{(o.releaseTime).slice(0,4) + "年" + (o.releaseTime).slice(4,6) + "月" + (o.releaseTime).slice(6,8) + "日 " + (o.releaseTime).slice(8,10) + ":" + (o.releaseTime).slice(10,12) + ":" + (o.releaseTime).slice(12,14)}}
							</u-col>
					</u-row>

				</view>

			</view>
		</u-card> -->

		<view style="width: 100%; background-color: #FFFFFF;">
			<view>
				<view v-if="courseNoticeData.length == 0" style="margin-top: 50rpx; text-align: center;font-size:100%; color: #909399;">
					（暂无公告）
				</view>
				<view v-else v-for="(o ,index) in courseNoticeData" :key="index" style="margin: 20rpx 30rpx;">
					<view @click="gototext(o.id,o.courseId)">
						<view style=" font-size:120%;">
							{{o.courseNoticeTitle}}
						</view>
						<view style=" font-size:80%; color: #909399; margin-top: 15rpx;">
							{{(o.releaseTime).slice(0,4) + "-" + (o.releaseTime).slice(4,6) + "-" + (o.releaseTime).slice(6,8) + "  " + (o.releaseTime).slice(8,10) + ":" + (o.releaseTime).slice(10,12) + ":" + (o.releaseTime).slice(12,14)}}
						</view>
						<u-divider :use-slot="false" half-width="340" style="margin-top: 25rpx;" />
						
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getCourseNotice
	} from "@/api/modules/course.js"
	export default {
		props: {
			courseID: {
				type: String,
				default: ''
			}
		},
		data() {
			return {
				courseNoticeData: []
			}
		},
		mounted() {

		},
		watch: {
			courseID: {
				immediate: true, // 这句重要
				handler(val) {
					let that = this;

					// console.log(val)

					// 获取课程ID对应的章节列表
					let data = {
						courseInfoId: val
					}

					getCourseNotice(data)
						.then(resp => {
							// console.log(resp)
							this.courseNoticeData = resp.data
						})
						.catch(resp => {})
				}
			}

		},
		methods: {
			gototext(id, courseId) {
				uni.navigateTo({
					url: "./courseDetails/components/text?id=" + id + "&" + "courseId=" + courseId,
				})

			}
		}
	}
</script>

<style scoped>
	.u-card-wrap {
		background-color: $u-bg-color;
		padding: 1px;
	}

	.u-body-item {
		font-size: 32rpx;
		color: #333;
		padding: 20rpx 10rpx;
	}

	.u-body-item image {
		width: 120rpx;
		flex: 0 0 120rpx;
		height: 120rpx;
		border-radius: 8rpx;
		margin-left: 12rpx;
	}

	#notices {
		height: 120rpx;
	}
</style>
